﻿{extend name="public:base" /}

{block name="css"}
<link href="__ADMIN__/css/style.css" rel="stylesheet">
{/block}

{block name="content"}
<div class="wrapper wrapper-content animated fadeInRight">
    <div class="row">
        <div class="col-lg-12">
            <div class="ibox ">
                <div class="ibox-content">
                    <form method="post" class="layui-form fairy-form">
                        <div class="box-item">
                            <div class="form-group row">
                                <div class="col-sm-1">
                                    <button class="btn btn-primary btn-xs add_param" type="button">新增服务保障</button>
                                </div>
                            </div>
                            <div class="param_main">
                                {empty name="service_guarantee"}
                                <div class="form-group row service_params_div">
                                    <div class="col-sm-2">
                                        <input type="text" class="form-control service_param" placeholder="请输入服务名">
                                    </div>
                                    <div class="col-sm-4">
                                        <input type="text" class="form-control service_value" placeholder="请输入服务描述">
                                    </div>
                                    <div class="btn-white btn-sm del_param" style="line-height: 25px;" onclick="delService(this)">
                                        <i class="iconfont icon-trash"></i> 删除
                                    </div>
                                </div>
                                {else /}
                                {volist name="service_guarantee" id="vo"}
                                <div class="form-group row service_params_div">
                                    <div class="col-sm-2">
                                        <input type="text" class="form-control service_param" placeholder="请输入服务名" value="{$vo.param}">
                                    </div>
                                    <div class="col-sm-4">
                                        <input type="text" class="form-control service_value" placeholder="请输入服务描述" value="{$vo.value}">
                                    </div>
                                    <div class="btn-white btn-sm del_param" style="line-height: 25px;" onclick="delService(this)">
                                        <i class="iconfont icon-trash"></i> 删除
                                    </div>
                                </div>
                                {/volist}
                                {/empty}
                            </div>

                            <!--     产品参数     -->
                            <input type="hidden" name="service_param" class="service_input" value="{$service_guarantee}">

                            <div class="hr-line-dashed"></div>
                        </div>

                        <div class="form-group row">
                            <div class="col-sm-4 col-sm-offset-2">
                                <button type="button" class="btn btn-w-m btn-primary" onclick="save()">
                                    保存
                                </button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>

{/block}

{block name='js'}

<!-- 产品参数 -->
<script>
    //新增保障服务
    $('.add_param').click(function () {
        var param_div = '<div class="form-group row service_params_div">\n' +
          '                                <div class="col-sm-2">\n' +
          '                                    <input type="text" class="form-control service_param" placeholder="请输入服务名">\n' +
          '                                </div>\n' +
          '                                <div class="col-sm-4">\n' +
          '                                    <input type="text" class="form-control service_value" placeholder="请输入服务描述">\n' +
          '                                </div>\n' +
          '                                <div class="btn-white btn-sm del_param" style="line-height: 25px;" onclick="delService(this)"><i class="iconfont icon-trash"></i> 删除 </div>\n' +
          '                            </div>';

        $('.param_main').append(param_div);
    })

    // 删除保障服务
    function delService(that) {
        var index = $('.del_param').index(that);
        $('.service_params_div').eq(index).remove();
    }

    // 保存
    function save() {
        var service_len = $('.service_param').length;
        var service = [];
        for (var i = 0; i < service_len; i++) {
            var service_param = $('.service_param').eq(i).val();
            var service_value = $('.service_value').eq(i).val();

            if (service_param !== '' && service_value !== '') {
                var single_service = {
                    param: service_param,
                    value: service_value
                };
                service[service.length] = single_service;
            }
        }

        $.post("{:url('serviceGuarantee')}", {
            service_guarantee: JSON.stringify(service)
        }, function (res){
            layer.msg(res.msg);
        }, 'JSON')

    }

</script>
{/block}
